<style type="text/css">
.box{width:186px; height:210px;margin:10px auto;float: left;margin-left: 6px; position:relative;}
.box-title{ position:absolute;left:14px;top:100px;height:30px; line-height:30px;width:157px; text-align:center;color:#fff; z-index:99;}
.sunbox{width:156px; height:120px;margin:10px auto; overflow:hidden; background:url(http://img1.isou365.cn/paimai/yunying/images/tupianBg.jpg) no-repeat;}
.shangchuan{position: relative;overflow: hidden;display:inline-block;*display:inline;padding:4px 10px 4px;font-size:14px;line-height:18px;*line-height:20px;color:#fff;text-align:center;vertical-align:middle;cursor:pointer;background-color:#5bb75b;border:none;border-color:#e6e6e6 #e6e6e6 #bfbfbf;border-bottom-color:#b3b3b3;-webkit-border-radius:4px;-moz-border-radius:4px;border-radius:4px;}
.shangchuan input {position: absolute;top: 0; right: 0;margin: 0;border:none;opacity: 0;filter:alpha(opacity=0); cursor: pointer;}
.files{}
.delimg{height:18px; line-height:18px; position:absolute;top:5px;right:5px;width:18px;border-radius:50%; background:#20ab4f;color:#fff; text-align:center;cursor:pointer;}
/*.delimg{height:18px; line-height:18px;color:#fff; cursor:pointer;font-size:14px;}*/
.box .box-title-bg{ position:absolute;left:14px;top:100px;height:30px; line-height:30px;width:157px; background:#000; opacity:0.5;}
/*.sunbox-alret{ display:none; position:fixed;top:50%;left:50%; background:#fff;border-radius:5px;z-index:999;padding:20px;}*/
.sunbox-alret span{height:18px; line-height:18px; position:absolute;top:-5px;right:-5px;width:18px;border-radius:50%; background:#20ab4f;color:#fff; text-align:center;z-index:999; cursor: pointer;}
.sunbox-alret .xie-loading{cursor:pointer;position: absolute;top:50%;left:50%;margin:-25px 0 0 -25px;width:50px;height:50px; display:none;}
.sunbox-alret .xie-loading img{width:50px;height:50px; display: block;}
.box-plus{width:156px;height:120px; line-height:120px; text-align: center;color:#d3d9d9;font-size:60px; display:block; background:#fff;border:solid 2px #d3d9d9;margin-top:10px; cursor:pointer;}
.xuanzhe .lift-truck{width:280px;padding:10px;display:block; background:#e1e1e1;border-radius:5px;margin-left:140px;margin-top:-10px;}
.xuanzhe .lift-truck #taker_phone,.xuanzhe .lift-truck #taker_sex,.xuanzhe .lift-truck #taker_card,.xuanzhe .lift-truck #take_car_num{width:280px; display:block;height:30px; line-height:30px; text-align:left;}
.xuanzhe .lift-truck span em{float:left; display:block;width:60px; text-align:right;}

.progress { position: relative;
    margin-left: 42px;
    margin-top: -124px;
    width: 100px;
    padding: 1px;
    border-radius: 3px;
    display: none;
}
.bar {background-color: green; display:block; width:0%; height:20px; border-radius: 3px; }
.percent { position:absolute; height:20px; display:inline-block; top:3px; left:2%; color:#fff }
.xuanzhuan{width:40px;height:34px; display:none;background:#fff url(http://img1.isou365.cn/paimai/yunying/images/xuanzhuan.png) no-repeat;cursor:pointer; position:fixed;bottom:40px;left:50%;margin-left:-20px;border-radius:5px; z-index:99999;}
.fork{width:40px;height:40px; display:none;background:url(http://img1.isou365.cn/paimai/yunying/images/close.png) no-repeat;cursor:pointer; position:fixed;top:20px;right:20px;z-index:99999;}
</style>
<script>
    $(document).ready(function() {              
        $(".sunbox img").click(function(){      
            var Img=$(this).attr("src");            
            if(Img==""){
                $(".xie-loading").fadeIn();
            }else{
                $(".xie-loading").hide();
            }
            $(".pageBeijing").css("display","block");
            $(".sunbox-alret").fadeIn();
            $(".sunbox-alret img").attr("src",Img)
            $(".sunbox-alret").css({
                "marginTop":-$(".sunbox-alret").outerHeight()/2,
                "marginLeft":-$(".sunbox-alret").outerWidth()/2,
            })
        })  
        $(".sunbox-alret span").click(function(){
            $(".pageBeijing").css("display","none");
            $(".sunbox-alret").fadeOut();
        })

    });
</script>
<script type="text/javascript" src="/static/js/jquery.form.js"></script>
<script type="text/javascript" src="{:get_style_cdnurl()}paimai/yunying/js/jquery.rotate.min.js"></script>
<div class="sunbox-alret">
<!-- <span>×</span> -->
<img src="" />
</div>
<div class="fork"></div>
<div class="xuanzhuan"></div>
<div class="xie-loading"></div>
<div class="pageBeijing" style="z-index:998;"></div>
<h3 class="yonghu">过户信息</h3>
<div class="yuyue">
 <ul>
    <li class="yuCurrent">基本信息</li>
    <li>手续信息</li>
    <li>提车人</li>
 </ul>
</div>
<div class="listBox">
    <div class="yuList" style="display:block;">
        <div class="chezhu-xinxi">
            <div class="xinxi-conter xinxi-conter1" style="background: none;margin-bottom:10px;border: none">
                <h4 class="order_no">拍卖单号：<b>{$order.order_no}</b></h4>
            </div>
            <div class="transfer">
            <div class="xinxi-conter xinxi-conter1">
            <h4>车辆信息</h4>
            <ul>
                <li class="clearfix">
                    <em>车型</em><em class="name-text">{$car.model}</em>
                    <em>排放标准</em><em class="dian-hua"><?php echo C('EMISSION')[$car['emission']];?></em>
                </li>

                <li class="clearfix">
                    <em>初登日期</em><em class="name-text">{$car.first_reg_date}</em>
                    <em>颜色</em><em class="dian-hua"><?php echo C('CAR_COLOR')[$car['car_color']];?></em>
                </li>
                <li class="clearfix">
                    <em>表显里程</em><em class="name-text">{$car.pointer_mileage}万公里</em>
                    <em>车况级别</em><em class="name-text">{$car.composite_state}{$car.accident_level}</em>
                </li>
                <li class="clearfix">
                    <em>车辆注册地</em><em class="name-text">{$car.reg_city}</em>
                    <em>竞拍结束时间</em><em class="name-text">{$order.bidding_end_time}</em>
                </li>
                <li class="clearfix">
                    <em>车牌号</em><em class="name-text">{$car.plate}</em>
                    <em>车架号</em><em class="name-text">{$car.vin}</em>
                </li>
                <li class="clearfix">
                    <em>年检有效期</em><em class="name-text">{$car.verify_expiry}</em>
                    <em>交强险有效期</em><em class="name-text">{$car.com_insure_expiry}</em>
                </li>
                <li class="clearfix">
                    <em>违章查询</em><em class="name-text">罚扣{$car.ill_deduc_point}分   罚款{$car.forfeit}元</em>
                    <em>过户限制</em><em class="name-text"><?php echo C('TRANSFER_LIMIT')[$car['transfer_limit']];?></em>
                </li>
                <li class="clearfix">
                    <em>渠道来源</em><em class="name-text">
                            <if condition="$car.comefrom neq ''">
                            <?php if(empty($car['comefrom_url'])):?>
                              <?php echo $show_from[$car['comefrom']];?>
                            <?php else: ?>
                              <a href="{$car.comefrom_url}" target="_blank" rel="noreferrer"><?php echo $show_from[$car['comefrom']];?></a>
                            <?php endif;?>
                            <else/>
                              未知
                            </if>
                        </em>
                        <em>所在地</em><em class="name-text">{$location_area}</em>
                </li>
            </ul>
          </div>
          <br/>

          <div class="xinxi-conter xinxi-conter1">
            <h4>原车主信息</h4>
            <ul>
                <li class="clearfix">
                    <em>车主类型</em><em class="name-text">{$owner.owner_type_name}</em>
                    <if condition="$owner.owner_type eq 1">
                        <em>原车主姓名</em><em class="name-text">{$owner.seller_name}</em>
                        <else />
                        <em>原公司名称</em><em class="dian-hua">{$owner.seller_name}</em>
                    </if>
                </li>
                <li class="clearfix">
                    <if condition="$owner.owner_type eq 1">
                        <em>原联系电话</em><em class="name-text">{$owner.phone}</em>
                        <else />
                        <em>原联系人姓名</em><em class="name-text">{$owner.contact_person}</em>
                        <em>原联系电话</em><em class="dian-hua">{$owner.phone}</em>
                    </if>
                </li>
            </ul>
          </div>
          <br/>

          <div class="xinxi-conter xinxi-conter1">
            <h4>评估师信息</h4>
            <ul>
                <li class="clearfix">
                    <em>评估师</em><em class="name-text">{$checker_info.real_name}</em>
                    <em>评估师电话</em><em class="dian-hua">{$checker_info.mobile}</em>
                </li>
            </ul>
          </div>
          <br/>

          <div class="xinxi-conter xinxi-conter1">
            <h4>车商信息</h4>
            <ul>
                <li class="clearfix">
                    <em>车商联系人</em><em class="name-text">{$dealer.contact_person}</em>
                    <em>联系人电话</em><em class="dian-hua">{$dealer.contact_mobile}</em>
                </li>
            </ul>
          </div>
          <br/>
           <div class="xinxi-conter xinxi-conter1">
            <h4>过户信息</h4>
            <ul>
                <li class="clearfix">
                    <em>过户限制</em><em class="name-text">{$transfer_info.transfer_limit}</em>
                    <em>开票要求</em><em class="name-text">{$transfer_info.invoice} 元</em>
                </li>
                <li class="clearfix">
                    <em>车辆落户</em>
                    <em class="name-text">{$transfer_info.transfer_to}</em>
                    <em>过户要求</em><em class="name-text">{$transfer_info.transfer_type}</em>
                </li>
                <li class="clearfix procedures">
                    <em class="uploadText1">手续上传要求</em><em class="name-text uploadText" style="width:827px;">{$transfer_info.procedures_upload}</em>
                </li>
                <script>
                  $(document).ready(function(){               
                    if($(".uploadText").html().length>89){   
                      $(".uploadText").css("lineHeight",22+"px");
                      $(".uploadText1").css({"lineHeight":50+"px","height":50+"px"});
                      $(".transfer ul .procedures").css("height",50+"px");
                      if($(".uploadText").html().length>161){                   
                        $(".uploadText").css("lineHeight",22+"px");
                        $(".uploadText1").css({"lineHeight":70+"px","height":70+"px"});
                        $(".transfer ul .procedures").css("height",70+"px");                    
                      }
                    }
                    
                  })
                </script>
            </ul>
          </div>
          <br/>
          <div class="xinxi-conter xinxi-conter1">
            <h4>备注信息</h4>
            <ul>
                <li class="clearfix">
                    <em>过户备注</em><em class="name-text">{$transfer_log.remark}</em>
                </li>
            </ul>
          </div>
          <br/>

            </div>
        </div>

        <h3 class="yonghu" style="margin-top:25px;">系统跟踪日志</h3>
        <div class="yonghuText">
            <ul>
                <foreach name="follow_log" item="f">
                    <li class="clearfix">
                        <em>{$f.createtime|strtotime|date='Y-m-d H:i',###}</em>
                        <em>{$f.real_name}</em>
                        <em>继续跟踪</em>
                        <em class="name-text">{$f.remark}</em>
                    </li>
                </foreach>
            </ul>
        </div>
    </div>

    <div class="yuList" style="display:none;">
        <div class="chezhu-xinxi" id='transfer_img'>
            <div class="transfer">
                <div class="xinxi-conter xinxi-conter1">
                    <h4>常规手续查看</h4>
                    <?php foreach ($alltype as $key =>$value): ?>
                        <?php if ($key <= 9): ?>
                            <div class="box">
                                    <div class="box-title"><?php echo $value; ?></div>
                                    <em class="box-title-bg"></em>
                                    <div class="sunbox">
                                        <?php foreach ($transfer_img as $v): ?>
                                            <?php if (!empty($v['url']) && $key == $v['type']): ?>
                                                <img src='<?php echo $host.$v[url] ?>@120h_156w'>
                                            <?php endif ?>
                                        <?php endforeach ?>   
                                    </div> 
                                    <?php if (in_array($key, $img_type)):?>
                                    <div class="shangchuan" style="background-color:#b3b3b3;cursor:Default">
                                    <a href="<?php echo $img_url[$key]; ?>" target="_blank"><span>下载</span></a>
                                        <input id="fileupload" type="button" name="pic" onchange="upload_img(this);">
                                    </div>
                                    <?php else:?>
                                    <div class="shangchuan">
                                        <span>上传</span>
                                        <input id="fileupload" type="file" name="pic" onchange="upload_img(this);">
                                    </div>
                                    <?php endif ?>
                                    <div class="progress">
                                        <span class="bar"></span><span class="percent">0%</span >
                                    </div>
                                    <div class="files">
                                        <?php foreach ($transfer_img as $v1): ?>
                                        <?php if ($v1['url'] !== '' && $key == $v1['type']): ?>
                                            <span class='delimg' img_id='<?php echo $v1[id] ?>' onclick='delimg(this)'>×</span>
                                        <?php endif ?>
                                        <?php endforeach ?>
                                    </div>     
                                    <input type="hidden" value="{$order.order_id}" name="order_id" >
                                    <input type="hidden" value="{$key}"  name="type">
                                </div>
                        <?php endif ?>         
                    <?php endforeach ?>

                </div>
                <div style="clear:both;"></div>

                <div class="xinxi-conter xinxi-conter1">
                    <h4>其他手续查看</h4>
                    <?php foreach ($transfer_img as $val): ?>
                        <?php if (!empty($val['url']) && $val['type']==10 ): ?>
                         <div class="box">
                                <div class="sunbox" >
                                    <img src='<?php echo $host.$val[url] ?>@120h_156w' >
                                </div> 
                                 <div class="shangchuan" style="background-color:#b3b3b3;cursor:Default">
                                    <a href="<?php echo $host.$val[url] ?>" target="_blank"><span>下载</span></a>
                                    <input type="button" name="pic" onclick="down_img(this);">
                                </div>
                                <div class="files"></div>
                                <input type="hidden" value="{$order.order_id}" name="order_id" >
                                <input type="hidden" value="10"  name="type">
                            </div>
                        <?php endif ?>
                    <?php endforeach ?>
                    <div class="box">
                        <div class="box-plus" onclick="add_box()">+</div>
                    </div>
                </div>

                <div style="clear:both;"></div>
            </div>
        </div>
    </div>
    <div class="yuList" style="display:none;">
        <div class="chezhu-xinxi">
             <div class="transfer">
                <div class="xinxi-conter xinxi-conter1">
                    <h4>提车人信息</h4>
                    <if condition="$order['is_other_channel_deal'] eq '1'">
                        <ul>
                            <li>
                                <em>提车人</em>
                                <em class="name-text">{$dealer.take_car_man}</em>
                            </li>
                        </ul>
                    <else/>
                        <ul>
                            <li class="clearfix">
                                <em>提车人</em><em class="name-text">{$succ_takeman.real_name}</em>
                                <em>手机</em><em class="name-text">{$succ_takeman.mobile}</em>
                            </li>
                            <li class="clearfix">
                                <em>性别</em><em class="name-text">
                                <?php if ($succ_takeman[sex] == 1): ?>
                                男
                                <?php elseif($succ_takeman[sex] == 2): ?>
                                女
                                <?php endif ?></em>
                                <em>提车数量</em><em class="name-text">{$succ_takeman.take_num}</em>
                            </li>
                            <li class="clearfix">
                                <em>身份证</em><em class="name-text">{$succ_takeman.idcard}</em>
                            </li>
                        </ul>
                    </if>
                </div>
            </div>
        </div>
    </div>
</div>
 <div style="clear:both;"></div>

    <div class="yongBtn1">
        <input type="button" onclick="window.close();" value="关闭" class="quxiao">
    </div>
<script type="text/javascript"> 
$(document).ready(function(){
  $('.sunbox img').each(function(){
    if ($(this).length>0) {
            $(this).parent().css('background','none');
            $(this).parent().css('background-color','#d3d9d9');
    };  
}) 

    
    window.onload=function(){            
        $(".sunbox img").click(function(){      
            var Img=$(this).attr("src").split("@");           
            $(".xuanzhuan").fadeIn();
            $(".fork").fadeIn();
            $(".xuanzhuan").fadeIn();
            $(".fork").fadeIn();
            $(".pageBeijing").css("display","block");
            $(".xie-loading").fadeIn();
            $(".sunbox-alret img").attr("src",Img[0]).get(0).onload=function(){
                $(".xie-loading").fadeOut();              
                $(".sunbox-alret").fadeIn();
                $(".sunbox-alret").rotate(0);
                $(".sunbox-alret").css("top",$(window).scrollTop());      
                $(".sunbox-alret").css({
                    "marginTop":100,
                    "marginLeft":-$(".sunbox-alret").outerWidth()/2,
                }) 
            };
        })
        var num = 0; 
        $(function(){
            $(".xuanzhuan").click(function(){ 
                num ++; 
                $(".sunbox-alret").rotate(90*num); 
            })
        })
        
        $(".fork").click(function(){
            $(".pageBeijing").css("display","none");
            $(".sunbox-alret").fadeOut();
            $(".xuanzhuan").fadeOut();
            $(".xie-loading").fadeOut();
            $(".fork").fadeOut();
             $(".sunbox-alret img").attr("src","");
            num = 0;
        })

    }
})

    function upload_img(obj){
        var box = $(obj).parent().parent('.box');
        var sunbox = $(obj).parent().siblings(".sunbox");
        var files = $(obj).parent().siblings(".files");
        var btn = $(obj).siblings("span");
        var progress = $(obj).parent().siblings(".progress");
        var bar =  $(obj).parent().siblings(".progress").children('.bar');
        var percent =  $(obj).parent().siblings(".progress").children('.percent'); 
        box.wrap("<form id='myupload' action='/Transfer/add_transfer_img' method='post' enctype='multipart/form-data'></form>");
        $("#myupload").ajaxSubmit({
            dataType:  'json',
            beforeSend: function() {
                sunbox.empty();
                progress.show();
                var percentVal = '0%';
                bar.width(percentVal);
                percent.html(percentVal);
                btn.html("上传中...");
                // $(obj).attr('type','botton');
                $(obj).parent().css("background-color","#b3b3b3");
            },
            uploadProgress: function(event, position, total, percentComplete) {
                var percentVal = percentComplete + '%';
                bar.width(percentVal);
                percent.html(percentVal);
            },
            success: function(data) {
                if (data.code == 200) {
                    progress.hide();
                    files.html("<span class='delimg' img_id='"+data.data.img_id+"' onclick='delimg(this)'>×</span>");
                    var img = data.data.pic+"@120h_156w";
                    sunbox.html("<img src='"+img+"'>");
                    btn.html("下载");
                    btn.wrap("<a href='"+data.data.pic+"' target='_blank'></a>");
                    btn.parent(".shangchuan").css("cursor","default");
                    btn.siblings("#fileupload").css("cursor","default");
                    $(obj).attr('type','botton');
                    $(obj).parent().css("background-color","#b3b3b3");
                    sunbox.css('background','none');
                    sunbox.css('background-color','#d3d9d9');

                    $(".sunbox img").click(function(){      
                        var Img=$(this).attr("src").split("@");           
                        $(".xuanzhuan").fadeIn();
                        $(".fork").fadeIn();
                        $(".pageBeijing").css("display","block");
                        $(".xie-loading").fadeIn();
                        $(".sunbox-alret img").attr("src",Img[0]).get(0).onload=function(){
                            $(".xie-loading").fadeOut();              
                            $(".sunbox-alret").fadeIn();
                            $(".sunbox-alret").rotate(0);
                            $(".sunbox-alret").css("top",$(window).scrollTop());      
                            $(".sunbox-alret").css({
                                "marginTop":100,
                                "marginLeft":-$(".sunbox-alret").outerWidth()/2,
                            }) 
                        };
                    })
                    var num = 0; 
                    $(function(){
                        $(".xuanzhuan").click(function(){ 
                            num ++; 
                            $(".sunbox-alret").rotate(90*num); 
                        })
                    })
                    
                    $(".fork").click(function(){
                        $(".pageBeijing").css("display","none");
                        $(".sunbox-alret").fadeOut();
                        $(".xuanzhuan").fadeOut();
                        $(".xie-loading").fadeOut();
                        $(".fork").fadeOut();
                        $(".sunbox-alret img").attr("src","");
                        num = 0;
                    })

                }else{
                    progress.hide();
                    btn.html("上传");
                    $(obj).attr('type','file');
                    $(obj).parent().css("background-color","#5bb75b");
                    shibai_alert(data.msg,2000);
                }
                box.unwrap("<form id='myupload' action='/Transfer/add_transfer_img' method='post' enctype='multipart/form-data'></form>");;
            },
            error:function(xhr){
                // btn.html("上传失败");
                // files.html(xhr.responseText);
                // console.log(xhr.responseText);
                xhr.responseText = "图片过大";
                progress.hide();
                btn.html("上传");
                $(obj).attr('type','file');
                $(obj).parent().css("background-color","#5bb75b");
                //shibai_alert(xhr.responseText,2000);
                box.unwrap("<form id='myupload' action='/Transfer/add_transfer_img' method='post' enctype='multipart/form-data'></form>");;
            },
            clearForm: true   
        });
    }


    function delimg(obj){
        confirmAAA('<div style="color:red">您确定删除图片？</div>', confirm11);
        function confirm11() {
            $('.determine').click(function() {
                colse_hide();
                delimg_action(obj);
            });
        }
    }

    function confirmAAA(text,callback){
        var html='<div class="chenggong1"><span class="paidan">'+text+'</span><div class="shenhei-btn"><input type="button" value="确定" class="determine" /><input type="button" value="取消" class="cancel" onclick="colse_hide()" /></div></div>'
        $(".yunBei").css("display","block");
        $(document.body).append(html);
        $(".chenggong1").css("display","block");
        if(typeof(callback)!="undefined"){
            callback();
        }
    }
    function colse_hideA(){
        $(".yunBei").css("display","none");
        $(".chenggong1").fadeOut('slow',function(){
            $(".chenggong1").remove();
        });
    } 


   function delimg_action(obj){
        var img_id = $(obj).attr("img_id");
        var sunbox = $(obj).parent().siblings(".sunbox");
        var files = $(obj).parent(".files");
        var shangchuan = $(obj).parent().siblings(".shangchuan");
        $.post("/Transfer/del_transfer_img",{img_id:img_id},function(res){
            if(res.code==200){
                sunbox.html("");
                files.html("");
                files.children('.delimg').css("display","none");
                shangchuan.css("background-color","#5bb75b");
                shangchuan.html("<span>上传</span><input id='fileupload' type='button' name='pic' onchange='upload_img(this);'>");
                shangchuan.children("#fileupload").attr('type','file');
                sunbox.removeAttr("style");

            }else{
                delay_alert(res.msg);
            }
        },'json');
    }

   function add_box(){
        var addbox = $('.box-plus').parent('.box');
        $(addbox).before('<div class="box"><div class="sunbox"></div><div class="shangchuan"><span>上传</span><input id="fileupload" type="file" name="pic" onchange="upload_img(this);"></div><div class="progress"><span class="bar"></span><span class="percent">0%</span ></div><div class="files"></div><input type="hidden" value="{$order.order_id}" name="order_id" ><input type="hidden" value="10"  name="type"></div>'); 
        
   }

</script>

